
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="com.lp.cfg.ProConfig"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE html>
<html>
<head>
	<%@ include file="/WEB-INF/oss/iot/common/variable.jsp"%>
	<%@ include file="/WEB-INF/oss/iot/common/variable_js.jsp"%>
	<%@ include file="/WEB-INF/oss/iot/common/resource_lib.jsp"%>
	
	<style type="text/css">
			
	</style>

	<link rel="stylesheet" href="<%=basePath%>/lib/ztree/zTreeStyle.css" type="text/css">
	<script type="text/javascript" src="<%=basePath%>/lib/ztree/jquery.ztree.core.min.js"></script>
	<script type="text/javascript" src="<%=basePath%>/lib/ztree/jquery.ztree.excheck.min.js"></script>

	<style type="text/css">
		.ztree li a:hover {
		    text-decoration: none !important;
		}
	</style>
</head>
 <body>
  	<div>
  		<h1> Tree 树型结构   </h1>
  	
  		<div>
  			
  			<div id="showAreaTree" style="overflow-y: auto;">
				<ul id="treeInfo" class="ztree"></ul>
			</div>
  			
  		
  		</div>
  	
  	</div>
  	
</body>

<script type="text/javascript">
	
	var zTreeObj;		 // 左侧树形结构
	
	var treeConfig = {
		view : {
			showLine : false,
			showIcon : false
		},
		callback : { //回调函数                              
			onClick : clickfunc
		}
// 		,
// 		data: {
// 			simpleData: {
// 				enable: true
// 			}
// 		}
	};
	
	// 回调函数           
	function clickfunc(event, treeId, treeNode) {
		console.log(event);
		console.log(treeId);
		console.log(treeNode);
	}
	
// 	var zNodes = [
// 	          	{id:1, pId:0, name: "父节点1"},
// 	          	{id:11, pId:1, name: "子节点1"},
// 	          	{id:12, pId:1, name: "子节点2"}
// 	          ];
	
	 var zNodes = [
           {name:"test1", children:[
              {name:"test1_1"}, {name:"test1_2"}, {name:"test1_2" ,children:[
   	                  {name:"test1_1"}, {name:"test1_2"}, {name:"test1_2"  }
 	                 ] }
             ]
           },
           {name:"test2",  children:[
              {name:"test2_1"}, {name:"test2_2"}
             ]}
           ];
	
	zTreeObj = $.fn.zTree.init( $("#treeInfo"), treeConfig , zNodes);
	/* 获取所有树节点 */
	var nodes = zTreeObj.transformToArray(zTreeObj.getNodes());
	//展开第一级树
	zTreeObj.expandNode(nodes[0], true);
	zTreeObj.selectNode(nodes[0]);
	
	
	
</script>

</html>